<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>欢迎登录生产管理系统</title>
<style>
.label {
	float: left;
	width: 120px;
}

.infobox {
	width: 200px;
}

.error {
	color: red;
	padding-left: 10px;
}

.submit {
	margin-left: 125px;
	margin-top: 10px;
}

div {
	padding: 5px;
}
</style>
<link rel="stylesheet" type="text/css"
	href="static/jquery/redmond/jquery-ui-1.9.0.custom.min.css" />
<script type="text/javascript" src="static/jquery/jquery-1.8.2.min.js"></script>
<script type="text/javascript"
	src="static/jquery/jquery-ui-1.9.0.custom.min.js"></script>
<script type="text/javascript">
	function doLogon(postdata) {
		dispError('正在登录，请稍候...');
		$.ajax({
			url : "logon.htm",
			type : "POST",
			cache : false,
			data : postdata,
			dataType : "json",
			success : function(data, textStatus, jqXHR) {
				if (data != null && data != "") {
					if (data.success) {
						$("div#infobox").hide();
						window.location.href = 'main.htm?appid='+Math.random();
					} else {
						dispError(data.message);
					}
				} else {
					dispError("登录失败!");
				}
			},
			error : function(jqXHR, textStatus, errorThrown) {
				dispError("登录失败!");
			}
		});
	}

	function dispError(msg) {
		$("div#infobox").addClass("redbox").show();
		$("span#infomessage").html(msg);
		$("span#infoicon").removeClass("ui-icon-alert ui-icon-info").addClass(
				"ui-icon-alert");
	}

	$(document).ready(
			function() {
				$("div#infobox").hide();
				$(".error").hide();

				$(".ui-widget").css("left",
						((($(window).width()) / 2 - 230)) + "px").css("top",
						(($(window).height()) / 2 - 140) + "px");

				$("input[type=submit]").click(function(event) {
					event.preventDefault();
					$("div#infobox").hide();
					$(".error").hide();

					var userid = $("#userid").val();
					var password = $("#password").val();

					if (userid.length < 1) {
						$("#useriderr").show();
						return;
					}

					if (password.length < 1) {
						$("#pwderr").show();
						return;
					}

					doLogon({
						username : userid,
						password : password
					});
				});

				$("input[type=reset]").click(function(event) {
					$("div#infobox").hide();
					$(".error").hide();
					$("#userid").focus();
				});

				$("#userid").focus();
			});

	$(window).resize(function() {
		$(".ui-widget").css("left",
				((($(window).width()) / 2 - 230)) + "px").css("top",
				(($(window).height()) / 2 - 140) + "px");
	});
</script>
</head>
<body>
	<div class="ui-widget" style="position: absolute; width: 460px;">
		<div class="ui-widget-header">
			<span>系统登录</span>
		</div>
		<div class="ui-widget-content ui-corner-bottom">
			<form mothed="post" action="">
				<div>
					<span class="label" style="text-align: center;">用户名:</span><input
						type="text" class="infobox" name="userid" id="userid" /><span
						class="error" id="useriderr">不允许为空</span>
				</div>
				<div>
					<span class="label" style="text-align: center;">密&nbsp;&nbsp;&nbsp;码:</span><input
						type="password" class="infobox" name="password" id="password" /><span
						class="error" id="pwderr">不允许为空</span>
				</div>
				<div id="infobox" class="cornerbox">
					<p>
						<span id="infoicon" class="ui-icon ui-icon-info"
							style="float: left; margin-right: .3em;"></span> <span
							id="infomessage">Info message</span>
					</p>
				</div>
				<input class="submit" type="submit" value="确定"> <input
					class="cancel" type="reset" value="重置">
			</form>
		</div>
	</div>

</body>
</html>